﻿
var FG_HOLDER_SELECTOR = '.front-baner-gallery';

var FG_GI = new Array();
var FG_I = new Array();

var FG_ANIM = new Object();
FG_ANIM.FadeSpeed = 500;
FG_ANIM.AnimSpeed = 2000;
FG_ANIM.AnimEasing = 'easeInOutBack';

var FG_SIZE = new Object();
FG_SIZE.Scale = 0.915;
FG_SIZE.Margin = 30;
FG_SIZE.Width = 960;
FG_SIZE.Height = 720;
FG_SIZE.WidthAbove = function () { return Math.ceil(FG_SIZE.Width * FG_SIZE.Scale); };
FG_SIZE.HeightAbove = function () { return Math.ceil(FG_SIZE.Height * FG_SIZE.Scale); };
FG_SIZE.GetTopAbove = function () { return Math.ceil((FG_SIZE.Height - FG_SIZE.HeightAbove()) / 2) };

var FG_POS_CENTER = new Object();
FG_POS_CENTER.Left = 0;
FG_POS_CENTER.Top = 0;

var FG_POS_RIGHT = new Object();
FG_POS_RIGHT.Left = 0;
FG_POS_RIGHT.Top = FG_SIZE.GetTopAbove();

var FG_POS_LEFT = new Object();
FG_POS_LEFT.Left = 0;
FG_POS_LEFT.Top = FG_SIZE.GetTopAbove();

var FG_CRNIDX = 0;
var FG_RIGHTIDX = 1;
var FG_LEFTIDX = 0;

var FG_ARROWS_MARGIN = 40;

var FG_AUTO_TIME = 4000;
var FG_AUTO_TIME_ID = 0;

var FG_BLOCK_CHANGE = false;

var FG_HOLD;

$(function () {
    window.setTimeout('checkImagesLoaded();', 100);
    calculateProperties();
});

function checkImagesLoaded() {
    var allImagesLoaded = true;
    $(FG_HOLDER_SELECTOR + ' img').each(function () {
        if (allImagesLoaded)
            allImagesLoaded = this.complete || this.readyState === 4;
    });
    if (allImagesLoaded)
        startGallery();
    else
        window.setTimeout('checkImagesLoaded();', 100);
}

function calculateProperties() {
    FG_SIZE.WidthAbove = function () { return Math.ceil(FG_SIZE.Width * FG_SIZE.Scale); };
    FG_SIZE.HeightAbove = function () { return Math.ceil(FG_SIZE.Height * FG_SIZE.Scale); };
    FG_SIZE.GetTopAbove = function () { return Math.ceil((FG_SIZE.Height - FG_SIZE.HeightAbove()) / 2) };
    FG_POS_RIGHT.Top = FG_SIZE.GetTopAbove();
    FG_POS_LEFT.Top = FG_SIZE.GetTopAbove();
}

function startGallery() {

    // ustawienie obrazków
    $(FG_HOLDER_SELECTOR + ' > div:not(.arrows)').each(function () {
        FG_I.push($(this).find('.active'));
        FG_GI.push($(this).find('.gray'));
    });
    FG_LEFTIDX = FG_GI.length - 1;

    // ustawienie holdera
    FG_HOLD = $('<div style="position:relative;width:100%;height:' + FG_SIZE.Height + 'px"></div>');
    $(FG_HOLDER_SELECTOR).after(FG_HOLD);

    // usunięcie domyślnych powiązań obrazków
    for (var xi = 0; xi < FG_GI.length; xi++) {
        FG_GI[xi].remove();
    }

    // dodanie środkowego, prawego obrazka
    startAddCenter();
}

function startAddCenter() {
    FG_POS_CENTER.Left = Math.ceil(($(window).width() - FG_SIZE.Width) / 2);

    FG_I[FG_CRNIDX].removeAttr('style');
    FG_I[FG_CRNIDX].hide();
    FG_I[FG_CRNIDX].css({ position: 'absolute', left: FG_POS_CENTER.Left + 'px' });
    FG_I[FG_CRNIDX].appendTo(FG_HOLD);
    FG_I[FG_CRNIDX].fadeIn(FG_ANIM.FadeSpeed, function () { startAddRight(); });
}

function startAddRight() {
    FG_POS_RIGHT.Left = FG_POS_CENTER.Left + FG_SIZE.Width + FG_SIZE.Margin;
    FG_GI[FG_RIGHTIDX].removeAttr('style');
    FG_GI[FG_RIGHTIDX].hide();
    FG_GI[FG_RIGHTIDX].css({ position: 'absolute', left: FG_POS_RIGHT.Left + 'px', top: FG_POS_RIGHT.Top, width: FG_SIZE.WidthAbove(), height: FG_SIZE.HeightAbove() });
    FG_GI[FG_RIGHTIDX].appendTo(FG_HOLD);
    FG_GI[FG_RIGHTIDX].fadeIn(FG_ANIM.FadeSpeed, function () { startAddLeft(); });
}

function startAddLeft() {
    FG_POS_LEFT.Left = FG_POS_CENTER.Left - FG_SIZE.WidthAbove() - FG_SIZE.Margin;
    FG_GI[FG_LEFTIDX].removeAttr('style');
    FG_GI[FG_LEFTIDX].hide();
    FG_GI[FG_LEFTIDX].css({ position: 'absolute', left: FG_POS_LEFT.Left + 'px', top: FG_POS_LEFT.Top, width: FG_SIZE.WidthAbove(), height: FG_SIZE.HeightAbove() });
    FG_GI[FG_LEFTIDX].appendTo(FG_HOLD);
    FG_GI[FG_LEFTIDX].fadeIn(FG_ANIM.FadeSpeed, function () {
        startAddArrows();
        //dodanie automatycznego przewijania
        FG_AUTO_TIME_ID = window.setInterval('doAutomaticScroll();', FG_AUTO_TIME);
        $(FG_HOLD).mouseenter(function () {
            window.clearInterval(FG_AUTO_TIME_ID);
            FG_AUTO_TIME_ID = 0;
        });
        $(FG_HOLD).mouseleave(function () {
            if (FG_AUTO_TIME_ID === 0) {
                FG_AUTO_TIME_ID = window.setInterval('doAutomaticScroll();', FG_AUTO_TIME);
            }
        });
    });
}

function doAutomaticScroll() {
    moveLeft();
}

function startAddArrows() {
    $(FG_HOLDER_SELECTOR + ' > .arrows img.left').css({
        position: 'absolute',
        left: FG_ARROWS_MARGIN + 'px',
        top: '0px',
        visibility: 'hidden',
        cursor: 'pointer',
        zIndex: '99'
    }).appendTo(FG_HOLD);
    if ($(FG_HOLDER_SELECTOR + ' > .arrows img.left-gray').is('*')) {
        FG_HOLD.find('.left').data('onActive', FG_HOLD.find('.left').attr('src'));
        FG_HOLD.find('.left').data('onUnactive', $(FG_HOLDER_SELECTOR + ' > .arrows img.left-gray').attr('src'));
        FG_HOLD.find('.left').attr('src', FG_HOLD.find('.left').data('onUnactive'));
        FG_HOLD.find('.left').mouseenter(function () {
            $(this).attr('src', $(this).data('onActive'));
        });
        FG_HOLD.find('.left').mouseleave(function () {
            $(this).attr('src', $(this).data('onUnactive'));
        });
    }
    FG_HOLD.find('.left').click(function () {
        moveLeft();
    });
    FG_HOLD.find('.left').css('top', Math.ceil((FG_SIZE.Height - FG_HOLD.find('.left').height()) / 2) + 'px');
    FG_HOLD.find('.left').hide().css('visibility', '').fadeIn(FG_ANIM.FadeSpeed)

    $(FG_HOLDER_SELECTOR + ' > .arrows img.right').css({
        position: 'absolute',
        right: FG_ARROWS_MARGIN + 'px',
        top: '0px',
        visibility: 'hidden',
        cursor: 'pointer',
        zIndex: '99'
    }).appendTo(FG_HOLD);
    if ($(FG_HOLDER_SELECTOR + ' > .arrows img.right-gray').is('*')) {
        FG_HOLD.find('.right').data('onActive', FG_HOLD.find('.right').attr('src'));
        FG_HOLD.find('.right').data('onUnactive', $(FG_HOLDER_SELECTOR + ' > .arrows img.right-gray').attr('src'));
        FG_HOLD.find('.right').attr('src', FG_HOLD.find('.right').data('onUnactive'));
        FG_HOLD.find('.right').mouseenter(function () {
            $(this).attr('src', $(this).data('onActive'));
        });
        FG_HOLD.find('.right').mouseleave(function () {
            $(this).attr('src', $(this).data('onUnactive'));
        });
    }
    FG_HOLD.find('.right').click(function () {
        moveRight();
    });
    FG_HOLD.find('.right').css('top', Math.ceil((FG_SIZE.Height - FG_HOLD.find('.right').height()) / 2) + 'px');
    FG_HOLD.find('.right').hide().css('visibility', '').fadeIn(FG_ANIM.FadeSpeed)
}
function moveRight() {
    if (FG_BLOCK_CHANGE) return;
    FG_BLOCK_CHANGE = true;
    FG_I[FG_CRNIDX].css('z-index', '3');
    FG_GI[FG_CRNIDX].attr('style', FG_I[FG_CRNIDX].attr('style'))
    FG_GI[FG_CRNIDX].css('z-index', '2');
    FG_HOLD.append(FG_GI[FG_CRNIDX]);

    FG_I[FG_CRNIDX].animate({
        left: FG_POS_RIGHT.Left,
        width: FG_SIZE.WidthAbove() + 'px',
        height: FG_SIZE.HeightAbove() + 'px',
        top: FG_SIZE.GetTopAbove() + 'px',
        opacity: '0'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { $(this).remove(); });
    FG_GI[FG_CRNIDX].animate({
        left: FG_POS_RIGHT.Left,
        width: FG_SIZE.WidthAbove() + 'px',
        height: FG_SIZE.HeightAbove() + 'px',
        top: FG_SIZE.GetTopAbove() + 'px'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing);
    FG_GI[FG_RIGHTIDX].animate({
        left: (Math.ceil(FG_GI[FG_RIGHTIDX].css('left').replace('px', '')) + FG_SIZE.WidthAbove()) + 'px',
        opacity: '0'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { $(this).remove(); });
    FG_I[FG_LEFTIDX].attr('style', FG_GI[FG_LEFTIDX].attr('style'));
    FG_GI[FG_LEFTIDX].css('z-index', '2');
    FG_I[FG_LEFTIDX].css('z-index', '1');

    FG_HOLD.append(FG_I[FG_LEFTIDX]);

    FG_GI[FG_LEFTIDX].animate({
        left: FG_POS_CENTER.Left + 'px',
        top: '0px',
        width: FG_SIZE.Width + 'px',
        height: FG_SIZE.Height + 'px',
        opacity: '0'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { $(this).remove(); });

    FG_I[FG_LEFTIDX].animate({
        left: FG_POS_CENTER.Left + 'px',
        top: '0px',
        width: FG_SIZE.Width + 'px',
        height: FG_SIZE.Height + 'px'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { FG_BLOCK_CHANGE = false; });
    var FG_LEFTABOVE = FG_LEFTIDX - 1;
    if (FG_LEFTABOVE < 0)
        FG_LEFTABOVE = FG_GI.length - 1;

    FG_GI[FG_LEFTABOVE].css({ position: 'absolute', left: Math.ceil(FG_POS_LEFT.Left - FG_SIZE.WidthAbove() - FG_SIZE.Margin) + 'px', opacity: '0', top: FG_POS_RIGHT.Top, width: FG_SIZE.WidthAbove(), height: FG_SIZE.HeightAbove() });
    FG_HOLD.append(FG_GI[FG_LEFTABOVE]);
    FG_GI[FG_LEFTABOVE].animate({
        left: FG_POS_LEFT.Left + 'px',
        opacity: '1'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { $(this).css('opacity', ''); });

    FG_CRNIDX = FG_CRNIDX - 1;
    if (FG_CRNIDX < 0) {
        FG_CRNIDX = FG_GI.length + FG_CRNIDX;
    }
    FG_LEFTIDX = FG_CRNIDX - 1;
    if (FG_LEFTIDX < 0)
        FG_LEFTIDX = FG_GI.length - 1;

    FG_RIGHTIDX = FG_CRNIDX + 1;
    if (FG_RIGHTIDX == FG_GI.length)
        FG_RIGHTIDX = 0;
}

function moveLeft() {
    if (FG_BLOCK_CHANGE) return;
    FG_BLOCK_CHANGE = true;
    FG_I[FG_CRNIDX].css('z-index', '3');
    FG_GI[FG_CRNIDX].attr('style', FG_I[FG_CRNIDX].attr('style'))
    FG_GI[FG_CRNIDX].css('z-index', '2');
    FG_HOLD.append(FG_GI[FG_CRNIDX]);

    FG_I[FG_CRNIDX].animate({
        left: FG_POS_LEFT.Left,
        width: FG_SIZE.WidthAbove() + 'px',
        height: FG_SIZE.HeightAbove() + 'px',
        top: FG_SIZE.GetTopAbove() + 'px',
        opacity: '0'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { $(this).remove(); });
    FG_GI[FG_CRNIDX].animate({
        left: FG_POS_LEFT.Left,
        width: FG_SIZE.WidthAbove() + 'px',
        height: FG_SIZE.HeightAbove() + 'px',
        top: FG_SIZE.GetTopAbove() + 'px'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing);
    FG_GI[FG_LEFTIDX].animate({
        left: (Math.ceil(FG_GI[FG_LEFTIDX].css('left').replace('px', '')) - FG_SIZE.WidthAbove()) + 'px',
        opacity: '0'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { $(this).remove(); });
    FG_I[FG_RIGHTIDX].attr('style', FG_GI[FG_RIGHTIDX].attr('style'));
    FG_GI[FG_RIGHTIDX].css('z-index', '2');
    FG_I[FG_RIGHTIDX].css('z-index', '1');

    FG_HOLD.append(FG_I[FG_RIGHTIDX]);

    FG_GI[FG_RIGHTIDX].animate({
        left: FG_POS_CENTER.Left + 'px',
        top: '0px',
        width: FG_SIZE.Width + 'px',
        height: FG_SIZE.Height + 'px',
        opacity: '0'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { $(this).remove(); });

    FG_I[FG_RIGHTIDX].animate({
        left: FG_POS_CENTER.Left + 'px',
        top: '0px',
        width: FG_SIZE.Width + 'px',
        height: FG_SIZE.Height + 'px'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { FG_BLOCK_CHANGE = false; });
    var FG_RIGHTABOVE = FG_RIGHTIDX + 1;
    if (FG_RIGHTABOVE >= FG_GI.length)
        FG_RIGHTABOVE = 0;

    FG_GI[FG_RIGHTABOVE].css({ position: 'absolute', left: Math.ceil(FG_POS_RIGHT.Left + FG_SIZE.WidthAbove() + FG_SIZE.Margin) + 'px', opacity: '0', top: FG_POS_RIGHT.Top, width: FG_SIZE.WidthAbove(), height: FG_SIZE.HeightAbove() });
    FG_HOLD.append(FG_GI[FG_RIGHTABOVE]);
    FG_GI[FG_RIGHTABOVE].animate({
        left: FG_POS_RIGHT.Left + 'px',
        opacity: '1'
    }, FG_ANIM.AnimSpeed, FG_ANIM.AnimEasing, function () { $(this).css('opacity', ''); });

    FG_LEFTIDX = FG_CRNIDX;
    FG_CRNIDX = FG_RIGHTIDX;
    FG_RIGHTIDX = FG_RIGHTABOVE;

}